<template>
  <div class="home-container">
    <Top/>
    <div class="main">
      <SideBar/>
      <div class="right">
        <tags-view/>
        <router-view/>
      </div>
    </div>
  </div>
</template>

<script>
import Top from '@/components/layout/top.vue'
import SideBar from '@/components/layout/sideBar.vue'
import TagsView from "@/components/layout/TagsView.vue";
import {RouterView} from "vue-router";
export default {
  name: "Home",
  components: {Top,SideBar,RouterView,TagsView}
};
</script>

<style scoped>
/* container */
.home-container {
  width: 100%;
  height: 100%;
}



/* main */
.main {
  width: 100%;
  height: calc(100% - 52px);
  min-height: 200px;
  background-color: white;
  display: flex;
}



/* right */
.main > .right {
  width: 100%;
  height: 100%;
  min-width: 300px;
}
</style>
